import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

//自定义组件
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // MaterialApp是根组件
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Stack'),
        ),
        body: HomeContent(),
      ),
      theme: ThemeData(primaryColor: Colors.blue),
    );
  }
}

//Stack可以控制多个组件之间的堆叠关系,堆叠顺序是数组顺序。所以不要搞反了，会导致覆盖。而且位置设置单一
//所以只是用来设置两个组件之间的相对堆叠位置，
//如果要更方便灵活的多模块堆叠需要positioned+stack or align + statck
class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Stack(
        //控制Container与Text的堆叠关系
        alignment: Alignment(0, 0),
        // alignment: Alignment.center,
        children: [
          Container(
            height: 400,
            width: 300,
            color: Colors.amber,
          ),
          Text(
            "data1",
            style: TextStyle(fontSize: 50, color: Colors.white),
          ),
        ],
      ),
    );
  }
}
